<template>
	<div class="mark" :class="isHandle?'handle':'unHandle'">
		<div class="content iconfont" :class="isHandle?'el-icon-check':'el-icon-warning-outline'"></div>
		<div class="content">
			{{isHandle ? "已处理":"未处理" }}
		</div>
	</div>
</template>

<script>
	export default {
		props:["isHandle"]
	}
</script>

<style lang="scss" scoped>
	.handle{
		border:50px solid #0099ff;
	}
	.unHandle{
		border:50px solid rgb(231, 13, 13);
	}
	.mark{
		width:0px;
		height:135px;
		border-bottom:35px solid transparent;
		border-top:none;
		position:absolute;
		top:0;
		right:0px;
	}
	.content{
		width:100px;
		line-height:30px;
		text-align:center;
		font-size:22px;
		color:#fff;
		position:absolute;
		left:-50px;
		top:55px;
		&:nth-child(1){
			font-size:46px;
			line-height:46px;
			top:10px;
		}
	}
</style>